<template>
  <headerXX :name="title"></headerXX>
  <van-pull-refresh
    class="pull-refresh"
    v-model="refreshing"
    @refresh="onRefresh"
  >
    <van-empty
      v-if="indexList.length == 0 && !error"
      image="search"
      description="未找到数据"
    />
    <van-empty v-if="error" image="error" description="网络错误" />
    <van-list
      :immediate-check="false"
      v-model:loading="loading"
      :finished="finished"
      :error.sync="error"
      error-text="请求失败，点击重新加载"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <!-- 列表内容 -->
      <div class="list"  v-if="indexList.length>0">
        <div
          class="list_item"
          v-for="(item, index) in indexList"
          :key="index"
          v-if="list.length"
        >
          <text class="list_item_title" v-if="list[0][index].length > 0">{{
            item
          }}</text>
          <div class="list_itemArr">
            <div class="list_itemArritem_info" v-if="list[0][index].length > 0">
              <van-cell
                title="健康检测一体机"
                :value="itemAA.creationTime"
                v-for="itemAA in list[0][index]"
                is-link
                @click="TZ(itemAA)"
              />
            </div>
          </div>
        </div>
      </div>
      <!-- 自定义错误提示（可选增强样式） -->
      <template #error>
        <div class="error-tip" @click="retryLoad">
          <van-icon name="warning" />
          <span>加载失败，点击重试</span>
        </div>
      </template>
    </van-list>
  </van-pull-refresh>
</template>

<script setup>
import { ref, onMounted } from "vue";
import headerXX from "../../components/title.vue";
import moment from "moment";
import { selectUser } from "@/api/home.js";
import { getUserBodyCompositionListPage } from "@/api/JBJJ_JKZC_GXGJ_SHFS/index.js";
import { getandroidCode } from "../../common/auth";
import { useRouter } from "vue-router";
let title = ref("健康分析");
let monthList = ref([
  "1月",
  "2月",
  "3月",
  "4月",
  "5月",
  "6月",
  "7月",
  "8月",
  "9月",
  "10月",
  "11月",
  "12月",
]);
const monthNumberList = ref([
  "01",
  "02",
  "03",
  "04",
  "05",
  "06",
  "07",
  "08",
  "09",
  "10",
  "11",
  "12",
]);
const monthUseList = ref([]);
const nowMonth = ref(moment().format("YYYY-MM").slice(-2));
const nowYear = ref(moment().format("YYYY"));
const indexList = ref([]);
const list = ref([]);
const itemArr = ref([]); // 列表数据
const router = useRouter();
const loading = ref(false);
const finished = ref(false);
const refreshing = ref(false);
const error = ref(false); // 控制错误状态
let XXyz = ref({
  mobile: "",
  pageNumber: 1,
  pageSize: 10,
});
function TZ(val) {
    console.log(val);
    let li = encodeURIComponent(JSON.stringify(val));
    router.push({
      path: "/JKZC/QBXM",
      query: {
        val: li,
      },
    });
}
// 加载数据
const onLoad = () => {
  loading.value = true;
  let XX = [];
  for (let i = 0; i < monthNumberList.value.length; i++) {
    if (nowMonth.value == monthNumberList.value[i]) {
      monthUseList.value = monthNumberList.value.slice(0, i + 1);
    }
  }
  for (let i = 0; i < monthUseList.value.length; i++) {
    XX.push([]);
  }
  indexList.value = monthUseList.value.map((item) => {
    return nowYear.value + "年" + monthList.value[item - 1];
  });
  if (error.value) return; // 如果当前是错误状态，不自动触发加载
  if (refreshing.value) {
    list.value = [];
  }
  selectUser({
    ishid: getandroidCode(), //拿到编码
  }).then((resXX) => {
    XXyz.value.mobile = resXX.data.mobile;
    getUserBodyCompositionListPage(XXyz.value).then((res) => {
      if (res.resultMessage != "SUCCESS") {
        list.value = [];
        error.value = true; // 显示错误提示
        // loading.value = false;
      } else if (res.data.length == 0) {
        list.value = [];
        finished.value = true;
      } else {
        res.data.forEach((item) => {
          let month = item.creationTime.slice(5, 7);

          monthUseList.value.forEach((item2, index) => {
            if (month == item2) {
              XX[index].push(item);
            }
          });
        });
        list.value = [...list.value, XX];
        // list.value = res.data;
      }
      //loading.value = false;
      // 判断是否已加载完所有数据
      if (list.value.length == res.pageNum) {
        finished.value = true;
      } else {
        XXyz.value.pageNumber++;
      }
      refreshing.value = false;
    });
  });
  //   getPostAllList(XXyz.value).then((res) => {

  //   });
};
onLoad();
// 下拉刷新
const onRefresh = () => {
  //   list.value = [];
  XXyz.value.pageNumber = 1;
  XXyz.value.pageSize = 10;
  finished.value = false;
  error.value = false;
  loading.value = true;
  refreshing.value = true;
  onLoad();
};

// 点击重试
const retryLoad = () => {
  error.value = false;
  loading.value = true;
  onLoad();
};
</script>

<style lang="scss" scoped>
// @import "../../static/css/GYcSS.scss";
.list {
  width: 90%;
  margin: 0 auto;
  overflow: auto;
}

.list_item {
  margin: 10px auto;

  .list_item_title {
    font-size: 15px;
    color: #cccccc;
  }
}

.list_itemArr {
  background-color: #ffffff;
  border-radius: 10px;
  margin-top: 5px;
}
</style>